
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>


<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ page import="com.wgn.reportquery.utils.*"%>
<%@ page import="com.wgn.reportquery.service.*"%>


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="">
<meta name="author" content="">

<title>数据汇总</title>
<script src="<%=basePath%>js/Chart.bundle.js"></script>
<script src="<%=basePath%>js/utils.js"></script>
<!-- Bootstrap core CSS -->
<link href="<%=basePath%>css/bootstrap.min.css" rel="stylesheet">

<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<link href="<%=basePath%>css/ie10-viewport-bug-workaround.css"
	rel="stylesheet">
<link href="<%=basePath%>css/justified-nav.css"	rel="stylesheet">
<!-- Custom styles for this template -->
<link href="<%=basePath%>css/signin.css" rel="stylesheet">

<!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
<!--[if lt IE 9]><script src="../../js/ie8-responsive-file-warning.js"></script><![endif]-->
<script type="text/javascript" src="<%=basePath%>/js/jquery.js"></script>
<script type="text/javascript" src="<%=basePath%>/js/jquery-ui.js"></script>
<script type="text/javascript" src="<%=basePath%>/js/bootstrap-dropdown.js"></script>

<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<script type="text/javascript">
    $(document).ready(function(){
    $(".xz").bind("click",function(){
    var querytypevalue=encodeURI($(this).html());//encodeURI
    {
    	
    	window.location.href="<%=basePath%>dosomequery?querytype=chart&querytypevalue="+querytypevalue;
    }
    });
    
    });
    
    
    function look4typeajax(){    
    var querytypevalue=encodeURI($('#querytypevalue').val());
    if(querytypevalue.length>0)
    {
    var htmlobj=$.ajax({url:"<%=basePath%>dosomequery?querytype=LOOK4TYPE&querytypevalue="+querytypevalue,async:false});
    $('#dataset').html(htmlobj.responseText);
    }

    }
    </script>
    <script>
        var MONTHS = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
        var progress = document.getElementById('animationProgress');
        var config = {
            type: 'line',
            data: {
               labels:${xlist}
            	   //["January", "February", "March", "April", "May", "June", "July"]
        ,
                datasets: [{
                	label:${qtype},
                    fill: false,
                    borderColor: window.chartColors.red,
                    backgroundColor: window.chartColors.red,
                    data: 
                   ${ylist}
                }, {
                    label: "上限",
                    fill: false,
                    borderColor: window.chartColors.blue,
                    backgroundColor: window.chartColors.blue,
                    data: 
                    	 ${bigger}  
                    
                }, {
                    label: "下限",
                    fill: false,
                    borderColor: window.chartColors.yellow,
                    backgroundColor: window.chartColors.yellow,
                    data: 
                    	${smaller} 
                    
                }]
            },
            options: {
                title:{
                    display:true,
                    text:"图表"
                },
                animation: {
                    duration: 2000,
                    onProgress: function(animation) {
                        progress.value = animation.animationObject.currentStep / animation.animationObject.numSteps;
                    },
                    onComplete: function(animation) {
                        window.setTimeout(function() {
                            progress.value = 0;
                        }, 2000);
                    }
                }
            }
        };

        window.onload = function() {
            var ctx = document.getElementById("canvas").getContext("2d");
            window.myLine = new Chart(ctx, config);
        };


    </script>
    <style>
canvas {
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
}
</style>
<link href="<%=basePath%>css/bootstrap.css" rel="stylesheet"
	type="text/css" />
</head>

<body>
	
	<div class="masthead">
     
        <nav>
          <ul class="nav nav-justified">
            <li class="active"><a href="<%=basePath%>SigninServlet">首页</a></li>
         <li><a href="<%=basePath%>jsp/signin.jsp">退出</a></li>
            <li><a href="<%=basePath%>jsp/regist.jsp">注册</a></li>
            <li><a href="http://www.shdc.org.cn/familyServices/index">上海市医院报告查询和门诊预约</a></li>
            <li><a href='<%=basePath%>jsp/downrj.jsp'>下载仁济app</a></li>            
          </ul>
        </nav>
      </div>
	<div class="container">


		<div class="well">
			<p>
		用户:${username}		
			</p>
		</div>
		<div class="row">
			<div class="col-sm-4">

				<div class="panel panel-primary">
					<div class="panel-heading">
							<h3 class="panel-title">分类报告</h3>
					</div>
					<div class="panel-body">
						<li><a href='<%=basePath%>dosomequery?querytype=chartreport&querytypevalue=1'>肝生化报告</a></li>
						<li><a href='<%=basePath%>dosomequery?querytype=chartreport&querytypevalue=2'>血常规报告</a></li>
					</div>
				</div>
			</div>
			

		</div>
		<div class="row">
			<div class="col-sm-4">

				<div class="panel panel-warning">
					<div class="panel-heading">
							<h3 class="panel-title">输入分类报告</h3>
					</div>
					<div class="panel-body">
						<li><a href='<%=basePath%>dosomequery?querytype=reportInput&querytypevalue=1'>输入肝生化报告</a></li>
						<li><a href='<%=basePath%>dosomequery?querytype=reportInput&querytypevalue=2'>输入血常规报告</a></li>
					</div>
				</div>
			</div>
			

		</div>
	<div class="row">
			<div class="col-sm-4">

				<div class="panel panel-primary">
					<div class="panel-heading">
							<h3 class="panel-title">指标列表</h3>
					</div>
					<div class="panel-body">
					<table class="table table-striped">
								<thead>
									<tr>
										<th>指标日期</th>
										<th>指标名称</th>
										<th>指标结果</th>
										<th>参考值</th>
										<th>比较结果</th>
										<th>单位</th>
									</tr>
								</thead>
								<tbody>${zbHtml}

								</tbody>
							</table>
					</div>
				</div>
			</div>
			

		</div>	
	<div class="row">
		<div class="col-sm-8">
			<div class="panel panel-danger">
				<div class="panel-heading">
					<h3 class="panel-title">选择其他指标</h3>
				</div>
			
			<div class="panel-body">
				<div class="row">
				<ul class="nav nav-pills">
			<li class="dropdown all-camera-dropdown"><a
				class="dropdown-toggle" data-toggle="dropdown" href="#"> -请下拉-<b
					class="caret"></b>
			</a>
				<ul class="dropdown-menu">${alltype}
				</ul></li>
		</ul>
		



				</div>
			</div>
		</div>
	</div></div>

<div class="row">
		<div class="col-sm-8">
			<div class="panel panel-danger">
				<div class="panel-heading">
					<h3 class="panel-title">或输入指标名称</h3>
				</div>
			
			<div class="panel-body">
				<div class="row">
				<span id='dataset'></span>
			<input  id='querytypevalue' type="text"  class="form-control"  required autofocus>
					
					<button onclick="look4typeajax()"
						class='btn btn-lg btn-success btn-block'>查询</button>



				</div>
			</div>
		</div>
	</div></div>


	
	</div>
<div style="width: 100%;">
<h3>要看清曲线，请旋转手机</h3>
		<canvas id="canvas"></canvas>
		<progress id="animationProgress" max="1" value="0" style="width: 100%"></progress>
	</div>	
	

	<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
	<script src="js/ie10-viewport-bug-workaround.js"></script>
</body>
</html>
